
import React from "react";
import Person from './components/person.js'

export default class Demo extends React.Component {
    input4 = React.createRef()
	state = {
        myName:'小溪流',
        personList:[
            {
                name:'小明',
                sex:'男',
                age:12
            },
            {
                name:'小兰',
                sex:'女',
                age:11
            }
        ],
    }
	render() {
        const {myName,personList} = this.state
		return (
			<div>
				<h2 onClick={this.clickMyName}>{myName}</h2>
                <div>---------------</div>
                {
                    personList.map((item, idx)=>{
                        return  <Person {...item} key={idx}/>
                    })
                }
                <div>------------------</div>
                <input ref={ c=>this.input1=c}/> 
                <input ref="input2"/>
                <input ref={this.saveInput}/>
                <input ref={this.input4}/>
                <button onClick={this.getInputStr}>点击获取input值</button>
			</div>
		)
	}
    clickMyName = () =>{
        console.log('点击了')
    }
    getInputStr = ()=>{
        console.log('this.', this.input1.value)
    }
    saveInput = (c)=> {
        this.input3=c
    }
}